var xmlhttp;
// Are we using a modern browser or ...
if (window.XMLHttpRequest) {
  // code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
} else {
  // code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}

function getJSON(){	
	if (xmlhttp.readyState==4 && xmlhttp.status==200) {
	    // var jsonobj = eval ("(" + xmlhttp.responseText + ")"); 
	    var jsondoc = JSON.parse(xmlhttp.responseText);
		displayData(jsondoc);
	}
}

function createTableRowContent(rowObject, data, cellType){
	var rowContent = document.createElement(cellType);
	var cell = document.createTextNode(data);
	rowContent.appendChild(cell);
	rowObject.appendChild(rowContent);
}

function createTableData(rowObject, data){
	createTableRowContent(rowObject, data, 'td');
}

function createTableHeader(rowObject, data){
	createTableRowContent(rowObject, data, 'th');
}

function displayData(jsonString){
	
	var table = document.createElement('table');
	table.border = "1";
	
	var thead = document.createElement('thead');
	table.appendChild(thead);
	
	var row = document.createElement('tr');
	
	createTableHeader(row, 'Community URL');
	createTableHeader(row, 'ID');
	createTableHeader(row, 'Name');
	createTableHeader(row, 'Type');
	createTableHeader(row, 'Desc');
	createTableHeader(row, 'Status');
	createTableHeader(row, 'Timestamp');
	
	thead.appendChild(row);
	
	var tbody = document.createElement('tbody');
	table.appendChild(tbody);
	
	for(i=0; i<jsonString.services.length; i++){
		var row = document.createElement('tr');

		createTableData(row, jsonString.services[i].community_url);
		createTableData(row, jsonString.services[i].id);
		createTableData(row, jsonString.services[i].name);
		createTableData(row, jsonString.services[i].type);
		createTableData(row, jsonString.services[i].description);
		createTableData(row, jsonString.services[i].status);
		createTableData(row, jsonString.services[i].timestamp);
				
		tbody.appendChild(row);
	}

	document.getElementById('mytable').innerHTML = '';
	document.getElementById('mytable').appendChild(table);
}

xmlhttp.onload = getJSON;

xmlhttp.open("GET", "/getservices.json", true);
xmlhttp.send();